import React,{Component} from 'react'
import payment from './payment.module.css'
export default class Payment extends Component{
    constructor(props){
        super(props)
        this.state={
            list:[],
            snum:'',
            totalpric:0
        }
    }
    render(){
        return (
            <div className={payment.wrap}>
                <div className={payment.m}>
                    <div className={payment.titBox}>
                        <img src='https://img2.fiveplus.com/rs/common/v1/web/css/icon_nike.png?v=20191119142609' alt=""/>
                        <div>
                            <h2>订单已完成，请继续完成支付！</h2>
                            <p>订单编号：<span>{this.state.snum}</span>     支付金额：<span className={payment.price}>￥{this.state.totalpric}</span></p>
                        </div>
                    </div>
                    <p>您需要支付<span className={payment.price}>￥{this.state.totalpric}元</span>，请选择：</p>
                    <div className={payment.picBoxWarp}>
                        <div className={payment.picBox}>
                            <img src={require('../img/bank_wecharscan.png')} alt=''/>
                            <img src={require('../img/bank_alipay.png')} alt=''/>
                            <img src={require('../img/bank_boc.png')} alt=''/>
                            <img src={require('../img/bank_ccb.png')} alt=''/>
                            <img src={require('../img/bank_cmb.png')} alt=''/>
                            <img src={require('../img/bank_icbc.png')} alt=''/>
                            <img src={require('../img/bank_abc.png')} alt=''/>
                            <img src={require('../img/bank_cib.png')} alt=''/>
                            <img src={require('../img/bank_cgb.png')} alt=''/>
                            <img src={require('../img/bank_fdb.png')} alt=''/>
                            <img src={require('../img/bank_hzb.png')} alt=''/>
                            <img src={require('../img/bank_shb.png')} alt=''/>
                            <img src={require('../img/bank_nbb.png')} alt=''/>
                            <img src={require('../img/bank_pingan.png')} alt=''/>
                            <img src={require('../img/bank_psb.png')} alt=''/>
                        </div>
                    </div>
                    <div className={payment.bottom}>
                        <p>支付<span className={payment.price}>￥{this.state.totalpric}</span></p>
                        <button>支付</button>
                    </div>
                </div>
            </div>
        )
    }
    componentDidMount(){
        window.scrollTo(0,0)
        let snum=''
        let totalpric=0;
        for(let i =0;i<8;i++){
            snum += parseInt(Math.random()*8)
        }
        this.setState({
            snum:snum,
            totalpric:this.props.location.state.totalpric
        })
        console.log(snum)
    }
}
